{include file="public/header"}
<title>客服</title>
    <style>
        body{
            width:100%;
            height:100%;
            margin:0;
            padding:0;
            background-color: #F7F7F7;
        }
        /*头部*/
        .top{
            height: 60px;
            width: 100%;
            background:rgba(22,26,39,1);
        }
        .top_box{
            width: 1200px;
            height: 100%;
            margin: 0 auto;
            align-items: center;

        }
        .top_name_left{
            width:38px;
            height:38px;
            background:rgba(52,99,230,1);
            border-radius:10px;
            margin-right: 10px;
        }
        .top_name{
            height:60px;
            font-size:24px;
            font-family:PingFangSC-Medium;
            font-weight:500;
            color:rgba(255,255,255,1);
            line-height:60px;
        }
        .top_name_r{
            width:76px;
            height:30px;
            border-radius:15px;
            border:1px solid rgba(255,255,255,1);
            margin-left:26px;
            align-items: center;
            justify-content: center;
            display: flex;
        }
        .top_name_r img{
            height: 16px;
            width: 16px;
        }
        .top_name_r span{
            height:22px;
            line-height: 22px;
            font-size:16px;
            font-family:PingFangSC-Regular;
            font-weight:400;
            color:rgba(255,255,255,1);
            margin-left: 3px;
        }
        .lii{
            height:22px;
            font-size:16px;
            font-family:PingFangSC-Regular;
            font-weight:400;
            color:rgba(255,255,255,1);
            line-height:22px;
            margin-right: 24px;
        }
        .top_login{
            margin-left: 36px;
            display: flex;
            align-items: center;
        }
        .top_login img{
            width: 28px;
            height: 28px;
        }
        .top_login span{
            height:22px;
            font-size:16px;
            font-family:PingFangSC-Regular;
            font-weight:400;
            color:rgba(255,255,255,1);
            line-height:22px;
            margin-left: 8px;
        }
        .top_marginR{
            margin-right: 16px;
        }
        /*头部*/

        /*footer1样式*/
        .footer{
            width:100%;
            height:130px;
            background:rgba(31,31,31,1);
            display: flex;
            align-items: center;
        }
        .footer_in{
            width: 1210px;
            margin: 0 auto;
            height:18px;
            font-size:13px;
            font-family:PingFangSC-Regular;
            font-weight:400;
            color:rgba(153,153,153,1);
            line-height:18px;
        }
        /*footer1样式*/
        .bar{
            width:1200px;
            height:57px;
            align-items:center;
            margin: 0 auto;
            font-size:12px;
            color:#999999;
        }
        .right_arrow{
            width:14px;
            height:14px;
            margin-left:6px;
            margin-right:6px;
        }
        .box{
            width:1200px;
            margin: 0 auto;
            margin-bottom:30px;
        }
        .left{
            width:150px;
            background:#FFFFFF;
            box-shadow:0px 4px 10px 0px rgba(0,0,0,0.04);
            border-radius:4px;
            margin-right:20px;
            height: 520px;
        }
        .right{
            width:1030px;
            height:470px;
            background:#FFFFFF;
            box-shadow:0px 4px 10px 0px rgba(0,0,0,0.04);
            border-radius:4px;
            padding-left:247px;
            padding-top:40px;
            padding-right:243px;
        }
        .avatar,.avatar img{
            width:80px;
            height:80px;
            border-radius:50%;
        }
        .avatar{
            margin:20px auto 10px;
        }
        .avatar img{
            object-fit: cover;
        }
        .phone{
            text-align:center;
            font-size:14px;
            color:#333;
            margin-bottom:20px;
        }
        .title{
            font-size:14px;
            color:#333;
            height:40px;
            line-height:40px;
            text-align: left;
            width: 58px;
            padding: 0 46px;
        }
        .hover:hover{
            text-decoration:underline;
            cursor:hand;
            cursor:pointer;
        }
        .blue{
            font-size:14px;
            color:#FFFFFF;
            height:40px;
            line-height:40px;
            text-align: left;
            width: 58px;
            padding: 0 46px;
            background-color:#3463E6;
        }
        .right_tit{
            height:60px;
            line-height:60px;
            padding-left:21px;
            font-size:15px;
            color:#333333;
            border-bottom:1px solid #EDEDED;
        }
        .active{
            color:#3463E6;
            border-bottom:2px solid #3463E6;
            border-radius:2px;
        }
        .right1{
            margin-left:43px;
        }
        .avatar1,.avatar1 img{
            width:120px;
            height:120px;
            border-radius:50%;
        }
        .avatar1{
            position:relative;
            margin:60px auto 60px;
        }
        .avatar1 img{
            object-fit: cover;
        }
        .mengban{
            position:absolute;
            top:0;
            left:0;
            width:120px;
            height:120px;
            text-align:center;
            line-height:120px;
            border-radius:50%;
            background:rgba(0,0,0,0);
            font-size:14px;
            color:#FFFFFF;
            opacity:0;
        }
        .mengban:hover{
            background:rgba(0,0,0,0.4);
            opacity:1;
        }
        .cName{
            line-height:40px;
            font-size:14px;
            color:#999;
        }
        input[type='text']{
            -webkit-appearance: none;
            outline: none;
            background: transparent;
            width:468px;
            height:40px;
            color: #666;
            font-size: 14px;
            margin: 0;
            padding-left:10px;
            padding-right:10px;
            border:1px solid #D0D0D0;
            border-radius:4px;
            margin-left:16px;
        }

        input::-webkit-input-placeholder {
            color: #AAAAAA;
            font-size: 14px;
        }
        .button{
            width:114px;
            height:38px;
            color: #FFFFFF;
            font-size: 14px;
            text-align:center;
            line-height:38px;
            border-radius:4px;
            background:#3463E6;
            float:right;
        }


        .right_top{
            width:56px;
            font-size:14px;
            font-weight:600;
            color:rgba(51,51,51,1);
            line-height:40px;

        }

        .top2{
            padding-top:20px;
            padding-bottom:20px;
        }


        textarea[type='text']{
            -webkit-appearance: none;
            outline: none;
            background: transparent;
            width:468px;
            height:148px;
            color: #666;
            font-size: 14px;
            margin: 0;
            padding-left:10px;
            padding-right:10px;
            padding-top:10px;
            border:1px solid #D0D0D0;
            border-radius:4px;
            margin-left:16px;
            line-height: 20px;
            font: 400 13.3333px Arial;

        }

        textarea::-webkit-input-placeholder {
            color: #AAAAAA;
            font-size: 14px;
            font: 400 13.3333px Arial;
        }

    </style>
</head>
<body>
<div class="bar flex-wrap">
    置家优选 <img src="__IMG__/right_arrow.png" class="right_arrow" />个人中心
</div>
<div class="box flex-wrap">
    {include file="public/body"}
    <div class="flex-con right">
        <form id="fabutask">
        <div class="flex-wrap">
            <span class="right_top">标题</span>
            <input type="text" name="title" lay-verify="required" maxlength="50" placeholder="请输入问题标题，最多输入50个字" />
        </div>
        <div class="flex-wrap top2">
            <span class="right_top">问题描述</span>
            <textarea type="text" name="k_desc" lay-verify="required" placeholder="请输入问题描述，最多150字" maxlength="150"></textarea>
        </div>
        <div class="button btn" style="cursor:pointer">立刻提交</div>
        </form>
    </div>
</div>
{include file="public/foot1"}
</body>
<script src="/static/admin/js/jquery.min.js"></script>

<script>
    $('.btn').click(function () {
        var formData = $( "#fabutask" ).serialize();
        $.ajax({
            url: '/home/User/service',
            data: formData,
            type: 'POST',
            dataType: 'JSON',
            success: function (returnData) {
                alert(returnData.msg);
                if(returnData.code == 200){
                    window.location.reload();
//                    window.location.href = '/home/User/index';
//                            return true;
                }
            },
            error: function () {
                alert('服务器错误，请刷新重试！');
            }
        })
//        }
    });
</script>
</html>
